<template>
	<div>
		<div class="container">
			<AForm v-model="infoData" :config="form" ref="form"></AForm>
		</div>
		<div class="searchButton">
			<el-button type="" size="mini" @click="back">返回</el-button>
			<el-button type="primary" size="mini" @click="save">提交</el-button>
		</div>
	</div>
</template>
<script>
	import * as regs from '@/utils/validator.js';
	import * as apis from '@/api/finance/manage/invoice/api.js';
	import AForm from '@/components/A/A-form/form/index.vue';
	export default {
		name: 'Invoice',
		components: { AForm },
		mixins: [],
		props: {},
		data() {
			return {
				infoData: { deptName: '', firmCode: '', receivableAmount: '' },
			};
		},
		dicts: ['invoice_type'],
		computed: {
			form() {
				return [
					{
						label: '开票公司',
						prop: 'deptName',
					},
					{
						label: '公司代码',
						prop: 'firmCode',
					},
					{
						label: '开票金额',
						prop: 'invoiceAmount',
					},
					{
						label: '发票类型',
						prop: 'invoiceType',
						type: 'select',
						dictList: this.dict.type.invoice_type,
						rules: true,
					},
					{
						label: '发票编号',
						prop: 'invoiceCode',
						type: 'input',
						rules: true,
					},
					// {
					//     label: "税额",
					//     prop: "taxAmount",
					//     type: "price",
					// },
					{
						label: '纳税人识别号',
						prop: 'taxpayerId',
						type: 'input',
						rules: true,
					},
					{
						label: '银行账号',
						prop: 'customerBankAccount',
						type: 'input',
						rules: [
							{
								required: true,
								message: '请输入收款账号',
								trigger: 'blur',
							},
							{
								pattern: regs.BANK_ACC_REG,
								message: '请输入正确银行账号',
								trigger: 'blur',
							},
						],
					},
					{
						label: '发票附件',
						prop: 'imgId',
						type: 'upload',
						prototype: {
							limit: 1,
						},
						block: true,
						rules: true,
						fitContent: true,
					},
					{
						label: '备注',
						prop: 'remark',
						type: 'textarea',
						block: true,
						fitContent: true,
					},
				];
			},
		},
		watch: {},
		created() {
			let query = this.$route.query;
			// this.infoData.deptName = query.deptName;
			// this.infoData.firmCode = query.firmCode;
			// this.infoData.receivableAmount = query.receivableAmount;
			// this.infoData.proceedsId = query.proceedsId;
			this.infoData = Object.assign(
				this.infoData,
				JSON.parse(this.Base64.decode(query.params)),
			);
		},
		mounted() {},
		methods: {
			back() {
				this.$tab.closeOpenPage(this.$route);
				this._toPage({
					path: '/finance/invoiceList',
				});
			},
			save() {
				console.log(this.infoData);
				this.$refs.form?.form_validate(valid => {
					if (!valid) {
						this.scrollToError();
						return;
					}
					this.$modal.loading('正在提交中，请稍候...');
					let params = this._.cloneDeep(this.infoData);
					apis.Save(params)
						.then(res => {
							if (res.code == 200) {
								this.$message.success('保存成功');
								this._toPage({
									path: '/finance/invoiceList',
									name: 'InvoiceList',
								});
							}
						})
						.finally(() => {
							this.$modal.closeLoading();
						});
				});
			},
		},
	};
</script>
<style lang="scss" scoped>
	.searchButton {
		margin: 20px;
		margin-top: 0;
		padding: 20px;
		background-color: #fff;
		display: flex;
		justify-content: flex-end;
		border-radius: 4px;
	}
	.container {
		margin: 20px;
		padding: 15px 20px;
		background-color: #fff;
		border-radius: 4px;
	}
</style>
